#{extends 'organization.html' /} 
#{set title:'Enter Filtration Data'/}

<link rel="stylesheet" type="text/css" href="@{'/public/stylesheets/jquery.autocomplete.css'}" />
<script type="text/javascript" src="@{'/public/javascripts/jquery.autocomplete.js'}"></script>

<h1> Please enter your filtration data. THANK YOU !</h1>
<div class = "viewContent">
#{ifErrors}

<p class = "error">Oops</p>
   #{errors}
     <p class = "error" >${error}</p>
   #{/errors}
 
#{/ifErrors}
#{form @ UserController.doFilterUsers()}
#{if displayNameField == true}
  <script>
  $(document).ready(function(){
    var data =  "${userNames}".split(", ")
    data[0] = data[0].substring(1,data[0].length)
    data[data.length-1] = data[data.length-1].substring(0,data[data.length-1].length-1)
  $("#one").autocomplete(data);
  });
  </script>
Name of the User: <input type="text" name = "name" id = "one"/><br/>
	
#{/if}

#{if displayGenderField == true}
  <script>
  $(document).ready(function(){
    var data =  "${genders}".split(", ")
    data[0] = data[0].substring(1,data[0].length)
    data[data.length-1] = data[data.length-1].substring(0,data[data.length-1].length-1)
  $("#two").autocomplete(data);
  });
  </script>
  
Gender of the User: <input type="text" name = "gender" id = "two"/><br/>

#{/if}

#{if displayEmailField == true}
  <script>
  $(document).ready(function(){
    var data =  "${emails}".split(", ")
    data[0] = data[0].substring(1,data[0].length)
    data[data.length-1] = data[data.length-1].substring(0,data[data.length-1].length-1)
  $("#three").autocomplete(data);
  });
  </script>
  
Email of the User: <input type="text" name = "email" id = "three"/><br/>

#{/if}

#{if allowAndOr == true}

Filter using: <br/>
<input type="radio" name = "andOr" value = "and">and<br/>
<input type = "radio" name = "andOr" value = "or">or

#{/if}

#{if displayNameField == true || displayGenderField == true || displayEmailField == true}
<input type="submit" value = "Proceed"/>

#{/if}
#{/form}
<br>
<br>
<br>
<br>
<br>
<a href="@{Browse.viewEntity(entityIDToPass)}" class = "standardLink"><b>Back to Entity<b/></a>
</div>
